import { Component, PropsWithChildren } from "react";
import { View, Text, Image } from "@tarojs/components";
import Taro from "@tarojs/taro";
import bg from "./images/i1.png";
import i2 from "./images/i2.png";
import i3 from "./images/i3.png";
import i4 from "./images/i4.png";
import i5 from "./images/i5.png";
import i6 from "./images/i6.png";
import i7 from "./images/i7.png";
import i8 from "./images/i8.png";
import Req from "../../utils/request";
import "./index.scss";
import { isEmpty } from "../../utils/kit";

export default class Index extends Component<PropsWithChildren> {
  state = {
    noticeInfo: {},
    unReadNum: 0, //获取未读数
    list: [
      {
        icon: i3,
        text: "项目管理",
        path: "/pages/project-management/index",
      },
      {
        icon: i4,
        text: "期债管理",
        path: "/pages/bond-futures/index",
      },
      {
        icon: i6,
        text: "支出管理",
        path: "/pages/expense-statistics/index",
      },
      {
        icon: i5,
        text: "运营管理",
        path: "/pages/operation-management/index",
      },
      {
        icon: i7,
        text: "监督管理",
        path: "/pages/supervision-issue/index",
      },
      {
        icon: i8,
        text: "消息通知",
        path: "/pages/notice/index?notice=2",
      },
    ],
  };

  componentDidMount() {
    this.initData();
  }
  initData = () => {
    Req.get("/notice/list").then((r) => {
      if (r.code === 200 && r.rows.length) {
        this.setState({
          noticeInfo: r.rows[0],
        });
      }
    });
  };
  componentWillUnmount() {}

  componentDidShow() {
    //获取消息未读数
    Req.get(
      "/message/getNum",
      {},
      {
        loading: false,
      }
    )
      .then((r) => {
        if (r.code === 200) {
          let _list = this.state.list;
          _list[_list.length - 1]["unRead"] = r.data;
          this.setState({
            list: _list,
          });
        }
      })
      .catch((e) => {});
  }

  componentDidHide() {}

  handleView(url: string) {
    Taro.navigateTo({
      url,
    });
  }
  render() {
    const { noticeInfo }: any = this.state;
    return (
      <View className="index">
        <Image mode="aspectFill" className="img-bg" src={bg} />
        <View className="main-wrapper">
          {!isEmpty(noticeInfo.title) && (
            <>
              <View className="l-t-1" onClick={() => {
                Taro.navigateTo({
                  url:"/pages/notice-detail/index?id="+noticeInfo.id
                })
              }}>
                <Image className="img-1" src={i2} />
                <View className="box-1">
                  <Text className="text-1">{noticeInfo.title}</Text>
                  <Text className="text-2">{noticeInfo.memo}</Text>
                </View>
              </View>
              <View className="line"></View>
            </>
          )}

          <View className="box-grid">
            {this.state.list.map((item: any, index) => (
              <View
                onClick={() => {
                  if (item?.path) {
                    this.handleView(item.path);
                  }
                }}
                key={index}
                className="btn-item"
              >
                <Image className="b-i-img" src={item.icon} />
                <Text className="b-i-text">{item.text}</Text>
                {item.unRead > 0 && (
                  <Text className="bagde-num">{item.unRead}</Text>
                )}
              </View>
            ))}
          </View>
        </View>
      </View>
    );
  }
}
